<div class="card-header">
    <div class="card-title">
        <h3 class="card-label">
            @L("DateAndTimePickers")
        </h3>
    </div>
</div>
<div class="card-body">
    <form role="form" class="form">

        <div class="form-group">
            <label for="SampleDatePicker">Default date picker</label>
            <div id="SampleDatePicker" class="input-group">
                <input type="datetime" name="SampleDatePicker" class="form-control date-picker">
                <span class="input-group-btn">
                    <button class="btn btn-primary test-btn-date-picker" type="button">@L("Submit")</button>
                </span>
            </div>
        </div>

        <div class="form-group">
            <label for="SampleDateTimePicker">Default datetime picker</label>
            <div id="SampleDateTimePicker" class="input-group">
                <input type="datetime" name="SampleDateTimePicker" class="form-control datetime-picker">
                <span class="input-group-btn">
                    <button class="btn btn-primary test-btn-datetime-picker" type="button">@L("Submit")</button>
                </span>
            </div>
        </div>

        <div class="form-group">
            <label for="SampleDateRangePicker">Default daterange picker</label>
            <div id="SampleDateRangePicker" class="input-group">
                <input type="datetime" name="SampleDateRangePicker" class="form-control daterange-picker">
                <span class="input-group-btn">
                    <button class="btn btn-primary test-btn-daterange-picker" type="button">@L("Submit")</button>
                </span>
            </div>
        </div>

    </form>
</div>
